<template>
	<view class="content">
		<!-- 封面组件：v-if控制，false时会销毁组件 -->
		<loadPageVue v-if="showCover" :class="{ 'fade-out': !showCover }" @click-welcome="handleWelcomeClick">
		</loadPageVue>

		<!-- 首页内容 -->
		<view class="text-area" :class="{ 'fade-in': !showCover }">
			<view class="headBoxVue-item">
				<headBoxVue :navBgImg="imgUrl"></headBoxVue>
			</view>
			<view class="register-box">
				<registerBoxVue></registerBoxVue>
			</view>
			<TabBar :currentIndex="0"></TabBar>
		</view>
	</view>
</template>



<script setup>
	import methods from '@/utils/methods.js'
	import {
		onMounted,
		ref
	} from 'vue'
	import {
		useStore
	} from 'vuex'
	import {
		$post,
		$get
	} from "@/utils/request.js"
	import loadPageVue from "../../components/loadPage/loadPage.vue"
	import headBoxVue from "./components/headBox/headBox.vue";
	import registerBoxVue from './components/registerBox/registerBox.vue';
	import TabBar from '../../components/TabBar/TabBar.vue';
	import {
		onShareAppMessage,
		onShareTimeline,
		onShow
	} from '@dcloudio/uni-app'

	const store = useStore()
	let isFirstTokenRequest = true;

	// 判断是否首次打开（
	const isFirstOpen = () => {
		return !uni.getStorageSync('firstOpenSubscribe');
	};

	// 标记为已打开过
	const setOpened = () => {
		uni.setStorageSync('firstOpenSubscribe', 'true');
	};

	// 控制封面显示：默认true，
	const showCover = ref(true);
	const authorization = () => {
		uni.requestSubscribeMessage({
			tmplIds: ['0tL9KP3wKuWMsRUEtOTJoklhjrUW9zOkAfuGQgXuDvM',
				'Lx98Aj6VRtjMM47liS52D0M5ClQ08hxuuGJslttlJ58'
			],
			success: (res) => {},
			fail: (err) => {}
		});
	};

	const handleWelcomeClick = () => {
		showCover.value = false;
		uni.setStorageSync('hasClosedCover', 'true');

		// 仅首次打开时触发订阅（原有逻辑不变）
		if (isFirstOpen()) {
			authorization();
			setOpened(); // 标记为已处理订阅，后续不再触发
		}
	};

	onMounted(() => {
		uni.hideTabBar();
		// 初始化封面显示状态
		const hasClosedCover = uni.getStorageSync('hasClosedCover');
		showCover.value = !hasClosedCover;

		if (!uni.getStorageSync('token')) {
			methods.login();
		} else {
			if (isFirstTokenRequest) {
				methods.againSet();
				methods.queryInfo();
				isFirstTokenRequest = false;
			}
		}
	});
	// 分享好友
	onShareAppMessage(() => {
		return {
			title: '访客小程序分享',
			path: '/pages/index/index',
		}
	})
	// 分享朋友圈
	onShareTimeline(() => {
		return {
			title: '访客小程序分享',
			path: '/pages/index/index'
		}
	})

	const imgUrl = ref('')
	onShow(() => {
		$get('/system/sshbConfig/getInfo').then(res => {
			if (res.code == 200) {
				if (res.data.wxBackgroundUrl) {
					imgUrl.value = res.data.wxBackgroundUrl
				}
			}

		})

	});
</script>

<style lang="scss">
	.content {
		position: relative;
		width: 100vw;
		height: 100vh;
		overflow: hidden;
	}

	/* 封面组件样式（确保动画正常执行） */
	loadPageVue {
		position: absolute;
		/* 覆盖在首页内容上方 */
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* 封面淡出动画 */
	.fade-out {
		opacity: 0;
		transform: scale(1.1);
		transition: all 0.8s ease-out;
		pointer-events: none;
	}

	/* 首页内容样式 */
	.text-area {
		width: 100%;
		height: 100%;
		opacity: 0;
		transition: opacity 0.8s ease-out 0.2s;
		position: relative;

		.headBoxVue-item {
			z-index: 10;
			position: absolute;
			top: 0;
			left: 0;
			width: 100vw;
			height: 600rpx;
		}

		.register-box {
			width: 100vw;
			height: 100%;
			z-index: 10;
			background-color: #EFF4FB;
			border-radius: 26px 26px 0px 0px;
			padding: 20px 12px;
			box-sizing: border-box;
			position: absolute;
			top: 560rpx;
			left: 0;
		}
	}

	/* 首页内容淡入效果 */
	.fade-in {
		opacity: 1;
	}
</style>